<template>
  <div class="home">
    <!-- 搜索栏 -->
    <router-link to="/home/searchpopup">
      <van-search
        v-model="value"
        placeholder="请输入搜索关键词"
        shape="round"
      />
    </router-link>
    <!-- 轮播图 -->
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="#39a9ed">
      <van-swipe-item v-for="item in banner" :key="item.id">
        <img :src="item.image_url" alt="图片加载失败" class="banner__img" />
      </van-swipe-item>
    </van-swipe>

    <!-- 添加一个入场效果 -->
    <transition name="van-slide-right">
      <router-view></router-view>
    </transition>
    <!--  -->
  </div>
</template>

<script>
import { GETHomeData } from '@/request/api.js'
export default {
  name: 'Home',
  components: {},
  data() {
    return {
      value: '武汉纺织大学',
      banner: []
    }
  },
  created() {
    GETHomeData().then(res => {
      this.banner = res.data.banner
    })
  }
}
</script>
<style lang="less">
.banner__img {
  width: 100%;
}
</style>
